<script setup>
</script>

<template>
  <router-view></router-view>
</template>

<style>
:root {
  /* 基础颜色 */
  --primary-color: #1890ff;
  --success-color: #52c41a;
  --warning-color: #faad14;
  --error-color: #f5222d;
  --border-radius: 4px;
  
  /* 浅色主题变量 */
  --bg-color: #ffffff;
  --bg-color-secondary: #f0f2f5;
  --text-color: #333333;
  --text-color-secondary: #666666;
  --border-color: #d9d9d9;
  --box-shadow: 0 2px 12px rgba(0,0,0,0.1);
  
  /* 菜单相关 */
  --menu-bg: #001529;
  --menu-text: #ffffff;
  --menu-active-bg: #1890ff;
  
  /* 添加 RGB 格式的颜色变量，用于设置透明度 */
  --primary-color-rgb: 24, 144, 255;  /* #1890ff 的 RGB 值 */
  --error-color-rgb: 245, 34, 45;     /* #f5222d 的 RGB 值 */
}

/* 深色主题 */
[data-theme='dark'] {
  --bg-color: #141414;
  --bg-color-secondary: #1f1f1f;
  --text-color: #ffffff;
  --text-color-secondary: #999999;
  --border-color: #434343;
  --box-shadow: 0 2px 12px rgba(0,0,0,0.3);
  
  /* 深色主题菜单 */
  --menu-bg: #1f1f1f;
  --menu-text: #ffffff;
  --menu-active-bg: #1890ff;
  
  /* 深色主题下可能需要调整一些颜色 */
  --primary-color-rgb: 24, 144, 255;
  --error-color-rgb: 245, 34, 45;
}

/* 色弱模式 */
.color-weakness {
  filter: grayscale(100%);
}

/* 紧凑模式 */
.compact-mode {
  --spacing-unit: 8px;
}

/* 全局基础样式 */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
    Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  background: var(--bg-color-secondary);
  color: var(--text-color);
  transition: all 0.3s;
}

/* 滚动条样式 */
::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-thumb {
  background: var(--border-color);
  border-radius: 3px;
}

::-webkit-scrollbar-track {
  background: var(--bg-color-secondary);
}

/* 选中文本样式 */
::selection {
  background: var(--primary-color);
  color: white;
}

/* 全局输入框样式 */
input {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--border-color);
  border-radius: var(--border-radius);
  background: var(--bg-color);
  color: var(--text-color);
  transition: all 0.3s;
  outline: none;
}

input:focus {
  border-color: var(--primary-color);
  box-shadow: 0 0 0 2px rgba(var(--primary-color-rgb), 0.1);
}
</style>
